<!DOCTYPE html>
<html>
<head>
    <title>药品查询--中软高科-2015</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap.css" />
    <link rel="stylesheet" type="text/css" href="../Css/bootstrap-responsive.css" />
    <link rel="stylesheet" type="text/css" href="../Css/style.css" />
    <script type="text/javascript" src="../Js/jquery.js"></script>
    <script type="text/javascript" src="../Js/bootstrap.js"></script>
    <script type="text/javascript" src="../Js/ckform.js"></script>
    <script type="text/javascript" src="../Js/common.js"></script>
    <script type="text/javascript" src="/Js/jquery-1.11.1.js"></script>
    <script type="text/javascript" src="/Js/bootstrap.js" ></script>
    <link  rel="stylesheet" type="text/css" href="/Css/bootstrap.css"></link>
    <link  rel="stylesheet" type="text/css" href="/Css/style.css"></link>
    <style type="text/css">
        body {
            padding-bottom: 40px;
        }
        .sidebar-nav {
            padding: 9px 0;
        }

        @media (max-width: 980px) {
            /* Enable use of floated navbar text */
            .navbar-text.pull-right {
                float: none;
                padding-left: 5px;
                padding-right: 5px;
            }
        }


    </style>
    <script type="text/javascript">
	 $(function () {
		$('#newNav').click(function(){
				window.location.href="add.html";
		 });
    });
	
   /* 	function checkall(){
			var alls=document.getElementsByName("check");
			var ch=document.getElementById("checkall");
			if(ch.checked){
				for(var i=0;i<alls.length;i++){
					alls[i].checked=true;	
				}	
			}else{
				for(var i=0;i<alls.length;i++){
					alls[i].checked=false;	
				}	
			}
		}
		function delAll(){
			var alls=document.getElementsByName("check");
			var ids=new Array();
			for(var i=0;i<alls.length;i++){
				if(alls[i].checked){
					ids.push(alls[i].value);
				}		
			}
			if(ids.length>0){
				if(confirm("确认操作?")){
					alert("成功!");
				}
			}else{
				alert("请选中要操作的项");
			}
		}*/
    </script>
</head>
<body>

<form id="myForm" action="index.html" method="post" class="definewidth m20 form-horizontal">
<table class="table table-bordered table-hover definewidth m10">
    <tr>
        <td width="10%" class="tableleft">药品名称：</td>
        <td><input type="text" name="drug_name" value=""/></td>
		
        <td width="10%" class="tableleft">药品类型：</td>
        <td><select name="drug_type">
            <option value="">请选择类型</option>
            <option value="中药">中药</option>
            <option value="西药">西药</option>
            <option value="处方">处方</option>
            <option value="非处方">非处方</option>
        </select></td>
    </tr>
    <tr>
		
		
		  <td colspan="4">
			<center>
				<button  onclick="loadData()" class="btn btn-primary" type="button">查询</button>
				<button type="reset" onclick="loadData()" class="btn btn-primary" type="button">清空</button>
			</center>
        </td>
    </tr>
</table>

   
<table class="table table-bordered table-hover definewidth m10" >
   <thead>
    <tr>
    	<th><input type="checkbox" id="checkall1" onChange="checkall();"></th>
        <th>药品编号</th>
        <th>药品名称</th>
        <th>药品类型</th>
        <th>简单描述</th>
        <th>状态</th>
        <th>剩余量</th>
        <th>操作</th>
    </tr>
    </thead>
    <tbody id="tbody">
	     <tr >
         	<td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
            <td style="vertical-align:middle;">J1121</td>
            <td style="vertical-align:middle;">感冒药</td>
            <td style="vertical-align:middle;">处方</td>
            <td style="vertical-align:middle;">用于普通感冒</td>
            <td style="vertical-align:middle;">销售中</td>
            <td style="vertical-align:middle;">1000袋</td>
            <td style="vertical-align:middle;">
					<a href="update.html">更改</a>&nbsp;&nbsp;&nbsp;
					<a href="add_medicine.html">添加库存</a>&nbsp;&nbsp;&nbsp;
					<a href="look.html">详情>>></a>
			</td>
        </tr>
	     <tr >
         	<td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
            <td style="vertical-align:middle;">J1121</td>
            <td style="vertical-align:middle;">感冒药</td>
            <td style="vertical-align:middle;">处方</td>
            <td style="vertical-align:middle;">用于普通感冒</td>
            <td style="vertical-align:middle;">销售中</td>
            <td style="vertical-align:middle;">1000袋</td>
                       <td style="vertical-align:middle;">
					<a href="update.html">更改</a>&nbsp;&nbsp;&nbsp;
					<a href="add_medicine.html">添加库存</a>&nbsp;&nbsp;&nbsp;
					<a href="look.html">详情>>></a>
			</td>
        </tr>
	     <tr >
         	<td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
            <td style="vertical-align:middle;">J1121</td>
            <td style="vertical-align:middle;">感冒药</td>
            <td style="vertical-align:middle;">处方</td>
            <td style="vertical-align:middle;">用于普通感冒</td>
            <td style="vertical-align:middle;">销售中</td>
            <td style="vertical-align:middle;">1000袋</td>
                       <td style="vertical-align:middle;">
					<a href="update.html">更改</a>&nbsp;&nbsp;&nbsp;
					<a href="add_medicine.html">添加库存</a>&nbsp;&nbsp;&nbsp;
					<a href="look.html">详情>>></a>
			</td>
	     <tr >
         	<td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
            <td style="vertical-align:middle;">J1121</td>
            <td style="vertical-align:middle;">感冒药</td>
            <td style="vertical-align:middle;">处方</td>
            <td style="vertical-align:middle;">用于普通感冒</td>
            <td style="vertical-align:middle;">销售中</td>
            <td style="vertical-align:middle;">1000袋</td>
                       <td style="vertical-align:middle;">
					<a href="update.html">更改</a>&nbsp;&nbsp;&nbsp;
					<a href="add_medicine.html">添加库存</a>&nbsp;&nbsp;&nbsp;
					<a href="look.html">详情>>></a>
			</td>
        </tr>
	     <tr >
         	<td style="vertical-align:middle;"><input type="checkbox" name="check" value="1"></td>
            <td style="vertical-align:middle;">J1121</td>
            <td style="vertical-align:middle;">感冒药</td>
            <td style="vertical-align:middle;">处方</td>
            <td style="vertical-align:middle;">用于普通感冒</td>
            <td style="vertical-align:middle;">销售中</td>
            <td style="vertical-align:middle;">1000袋</td>
                       <td style="vertical-align:middle;">
					<a href="update.html">更改</a>&nbsp;&nbsp;&nbsp;
					<a href="add_medicine.html">添加库存</a>&nbsp;&nbsp;&nbsp;
					<a href="look.html">详情>>></a>
			</td>
        </tr>
    </tbody>
  </table>
  <<div class="form-group">
    <div class="col-sm-3" style="text-align: right">
        <ul class="pagination" style="margin: 0;">
            <li name="pageLi" id="firstPage"><a href="javascript:void(0)">首页</a></li>
            <li name="pageLi" id="prePage"><a href="javascript:void(0)">上一页</a></li>
            <li name="pageLi" id="nextPage"><a href="javascript:void(0)">下一页</a></li>
            <li name="pageLi" id="lastPage"><a href="javascript:void(0)">末页</a></li>
        </ul>
    </div>
    <label class="control-label col-sm-3" style="text-align: right" >
        共<span id="total"></span>条数据，共<span id="pages"></span>页
    </label>
    <label class="control-label col-sm-1" style="text-align: right" >
        每页显示
    </label>
    <div   class="col-sm-1" style="text-align: right; padding:0;margin: 0" >
        <select class="form-control" name="pageSize">
            <option value="5">5</option>
            <option value="10">10</option>
            <option value="15">15</option>
        </select>
    </div>
    <label class="control-label col-sm-1" style="text-align: left;width: 87px;padding: 8px 5px;" >
        条数据
    </label>
    <label class="control-label col-sm-1" style="text-align: right" >
        跳转到第
    </label>
    <div   class="col-sm-1" style="text-align: right; padding:0;margin: 0" ><input class="form-control" name="pageNum" value="1" /></div>
    <label class="control-label col-sm-1" style="text-align: left">页</label>
</div>
</form>
<div>
    <button type="button" class="btn btn-success" id="newNav">添加新药</button>
    <button type="button" class="btn btn-success" id="delPro">导出Excel</button>
</div>
</body>
</html>
<script>
    $(function () {
        loadData();
        $("ul[class='pagination']>li").click(function(){
            if(($(this).attr("class"))=='disabled')
                return;
            let num=$(this).attr("name");
            $("input[name='pageNum']").val(num);
            loadData();
        });

        $('#newNav').click(function(){
            window.location.href="add.html";
        });
    });
    function deleteMenu(id){
        if(confirm("确定要删除吗?")) {
            //发起异步请求
            $.ajax({
                type: "POST",
                url: "/drug/" + id, //RESTful风格的API定义
                data: "_method=DELETE",
                success: function (vo) {
                    if(vo.code==200){
                        alert("删除成功！");
                        loadData();
                    }else{
                        alert("删除失败！"+vo.msg);
                    }
                }
            });
        }
    }
    function checkall(){
        //document.getElementsByTagName()
        var all = document.getElementById("checkall1");
        var arr=document.getElementsByName("choice");
        for(var i=0;i<arr.length;i++){
            arr[i].checked=all.checked;//循环遍历看是否全选
        }
    }
    function myOne() {
        var all = document.getElementById("checkall1");
        var arr=document.getElementsByName("choice");
        for(var i=0;i<arr.length;i++){
            if (arr[i].checked == false){
                all.checked = false;
                return
            }
        }
        all.checked =true;
    }
    function delAll(){
        var num = $("input[name='choice']:checked").length;
        var ids=new Array();
        if(num==0){
            alert("请选中要操作的项");
            return false;
        }else {
            if(confirm("确定要删除吗?")) {
                $("input[name='choice']:checked").each(function () {
                    ids.push($(this).val());
                });
                //发起异步请求
                $.ajax({
                    type: "POST",
                    url: "/drug/dellist", //RESTful风格的API定义
                    data: {ids:ids.toString()},
                    success: function (vo) {
                        if(vo.code==200){
                            alert("删除成功！");
                        }
                    }
                });
                loadData();
            }
        }
    }
    //填充分页信息
    function fillPageData(pageInfo) {
        //填充信息
        $("#total").html(pageInfo.total);
        $("#pages").html(pageInfo.pages);
        $("input[name='pageNum']").val(pageInfo.pageNum);
        $("select[name='pageSize']").val(pageInfo.pageSize);
        //设置按钮的属性值和样式
        $("#firstPage").attr("name",1);
        $("#prePage").attr("name",pageInfo.prePage);
        $("#nextPage").attr("name",pageInfo.nextPage);
        $("#lastPage").attr("name",pageInfo.pages);
        $("#firstPage").removeClass("disabled");
        $("#prePage").removeClass("disabled");
        $("#nextPage").removeClass("disabled");
        $("#lastPage").removeClass("disabled");
        if(pageInfo.isFirstPage){//如果是第一页：上一页和首页禁用
            $("#firstPage").addClass("disabled");
            $("#prePage").addClass("disabled");
        }
        if(pageInfo.isLastPage){//如果已经是最后一页：下一页和末页禁用
            $("#nextPage").addClass("disabled");
            $("#lastPage").addClass("disabled");
        }
    }
    String.prototype.GetValue= function(para) {
        let reg = new RegExp("(^|&)"+ para +"=([^&]*)(&|$)");
        let r = this.substr(this.indexOf("\?")+1).match(reg);
        if (r!=null) return unescape(r[2]); return null;
    }
    function loadData(){
        let url = document.location.toString();
        let pageNum=url.GetValue("pageNum");
        let pageSize=url.GetValue("pageSize");
        //alert($("#myForm").serialize())
        if(pageNum!=null&&$("input[name='pageNum']").val()!=null){
            $("input[name='pageNum']").val(pageNum);
        }
        if(pageSize!=null&&$("select[name='pageSize']").val()!=null){
            $("select[name='pageSize']").val(pageSize);
        }
        $.ajax({
            type: "GET",
            url: "/drug/list",
            data: $("#myForm").serialize(),//主要是分页和多条件参数数据
            dataType:"json",
            success: function(vo){
                //alert( "Data Saved: " + vo );
                let list=vo.pageInfo.list;
                let str="";
                for(let i=0;i<list.length;i++){
                    let obj=list[i];
                    let drug_id = obj.drug_id;
                    let drug = obj.drug_name;
                    let type = obj.drug_type;
                    let sim = obj.drug_simDesc;
                    let now = obj.drug_number;
                    let url = obj.drug_url;
                    let state = obj.drug_state;
                    let btnStr="";
                    if(state==0){
                        state = "销售中";
                        btnStr = '<a href="update.html?drug_id='+drug_id+'">更改</a>&nbsp;&nbsp;&nbsp;' +
                            '<a href="add_medicine.html?drug_id='+drug_id+'" >更新库存</a>&nbsp;&nbsp;&nbsp;'+
                            '<a href="look.html?drug_id='+drug_id+'">详情</a>';
                    }else if (state==1){
                        state = "禁售";
                        btnStr = '<span>已删除</span>';
                    }
                    str+='<tr>' +
                        '            <td><input type="checkbox" onclick="myOne()" value="'+drug_id+'" name="choice"/></td>' +
                        '            <td>'+drug_id+'</td>' +
                        '            <td>'+drug+'</td>' +
                        '            <td>'+type+'</td>' +
                        '            <td>'+sim+'</td>' +
                        '            <td>'+state+'</td>' +
                        '            <td>'+now+'</td>' +
                        '            <td>'+btnStr+'</td>' +
                        '</tr>'
                }
                $("#tbody").html(str);
                //填充分页数据
                fillPageData(vo.pageInfo);
            }
        });
    }
</script>